{extend name="public/base"/} {block name="body"}
<style>
    .mui-row.mui-fullscreen>[class*="mui-col-"] {
        height: 100%;
    }

    .mui-col-xs-3,
    .mui-col-xs-9 {
        overflow-y: auto;
        height: 100%;
    }

    .mui-segmented-control .mui-control-item {
        line-height: 50px;
        width: 100%;
    }

    .mui-control-content {
        display: block;
    }

    .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
        background-color: #fff;
    }
    .mui-toast-container {
        bottom: 50%;
        z-index: 999999999999999999;
    }
    .mui-btn-block{
      padding: 5px;
      border: 1px solid #ccc !important;
      margin: 5px;
      -webkit-appearance: none;
    }
    .active .mui-icon{
      display: block !important;
    }

</style>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/xsd/css/checkout.css" />
<header class="mui-bar mui-bar-nav" style="z-index:7">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">确定订单</h1>
</header>
<div  class="checkout-section"  style="padding-top: 44px;">
    <section class="cart-address" >
        <div class="address-item"   onclick='window.location.href = "{:url('index/address/index')}"'   {empty name="$address['sex']"}style="display: none;"{/empty}>
            <h2 class="address-name" > <b >{$address.name}</b> <span >{eq name="$address['sex']" value='1'}先生{else /}女士{/eq}</span> <span >{$address.tpl}</span> </h2>
            <p class="address-detail" >{$address.first_area|parse_config_value='delivery_area'} {$address.second_area|get_table_field="id","second_area","DeliveryArea"} {$address.address}</p> <span class="mui-icon mui-icon-arrowright"></span>  </div>
        <div class="address-item" onclick='window.location.href = "{:url('index/address/add')}"' {notempty name="$address['sex']"}style="display: none;"{/notempty} > 请添加一个收货地址 <span class="mui-icon mui-icon-arrowright"></span> </div>
    </section>

<br />
<section class="cart-group checkout-section">
    <ul class="foodlist" style="    margin: 0;">
        {volist name="cartlist" id="vo"}
          <li> <span class="cellname">{$vo.good_name}</span> <span class="cellquantity">x&nbsp;{$vo.num}</span> <span class="celltotal">¥{$vo['num']*$vo['good_price']}</span> </li>
        {/volist}
    </ul>
  <div class="fee" >
      <div >配送费</div>
      <div >¥{$address.freight}</div>
  </div>
  <div class="fee" >
      <div >余额支付</div>
      <div >-¥{$Request.session.user.balance}</div>
  </div>
  <div class="fee" >
      <div >运费补贴<br />(每消费10元,运费补贴5毛,补贴最高等于运费)</div>
      <div >-¥{:getSubsidy($cartCountprice, $address['freight'])}</div>



  </div>
    <div class="total">
        <div> <span>总计 ¥{$cartCountprice} 运费补贴 ¥{:getSubsidy($cartCountprice, $address['freight'])} 余额 ¥{$Request.session.user.balance}</span> &nbsp;&nbsp; </div>
        <span>实付<span style="color:red;"> ¥{$cartCountprice-getSubsidy($cartCountprice, $address['freight'])-$Request.session.user.balance}</span></span>
      </div>
</section>

<section class="checkout-section">
  <div class="fee" style='justify-content: flex-start;' >
    送货方式&nbsp;&nbsp;&nbsp;&nbsp;
     <input type="radio" name="way" {eq name="Think.cookie.way" value='1'}checked{/eq} value="1" />&nbsp;&nbsp; 送货上门
     &nbsp;&nbsp;<input type="radio" name="way" {eq name="Think.cookie.way" value='2'}checked{/eq} value="2">&nbsp;&nbsp; 到店自提
  </div>
</section>
<section class="checkout-section">
    <div class="cart-item fee" id="payment" style="    margin: 0;">
      <span>支付方式</span>
      <span class="cartitem-right">
        <i id="paywaytext" style="    font-style: normal;">
        {eq name="Think.cookie.pay" value='1'}微信支付{else /}货到付款{/eq}
        </i>
        <span class="mui-icon mui-icon-arrowright"></span>
      </span>
    </div>



    <aside class="paylist ">
        <header class="paylist-header">支付方式</header>
        <div class="paylist-item  {eq name='Think.cookie.pay' value='1'}active{/eq}" data-payway='1' ><span> 微信支付  </span> <span class="mui-icon mui-icon-checkmarkempty" style="color:#007aff;border: 1px solid;display:none"></span></div>
        <div class="paylist-item {eq name='Think.cookie.pay' value='2'}active{/eq}" data-payway='2'>
            <span> 货到付款 <small></small> </span> <span class="mui-icon mui-icon-checkmarkempty" style="color:#007aff;border: 1px solid;display:none"></span></div>
    </aside>
    <div class="mask "></div>


    <div class="cart-item fee" style="    margin: 0;"> <span>优惠券</span> <span class="cartitem-right"> <i style="    font-style: normal;">暂无可用优惠券</i> <span class="mui-icon mui-icon-arrowright"></span></span>
    </div>
</section>

<section class="checkout-section">
  <div class="cart-item fee" style="    margin: 0;" onclick="showDeliveryTime()">
    <span>配送时间</span>
     <span class="cartitem-right" id="pssj">
       <i style="    font-style: normal;">
         {empty name="Think.cookie.deliverytime"}
           请选择配送时间
         {else /}
           {$Think.cookie.deliverytime|setDeliverytimeText}
         {/empty}
       </i>
       <input type="hidden" name="deliverytime"   />
       <span class="mui-icon mui-icon-arrowright"></span>
     </span>
  </div>
</section>

</div>
<script id="tpl2" type="text/html">
      <div class="select-time-box">
          <dl style="width:50%"  id="jtdd"> <dt>{{rq}}<span>今天</span></dt>
              {{each list as value i}}
                <dd class="allow"   data-start="{{value.start_time}}"  data-text="{{rq2}}日{{value.start_time}}-{{value.end_time}}送达" data-val="{{rq}},{{value.start_time}}-{{value.end_time}}"> <label for="radio-choice-0">{{value.start_time}}-{{value.end_time}}</label> </dd>
              {{/each}}
          </dl>
          <dl style="width:50%"> <dt>{{rq2}}<span>明天</span></dt>
              {{each list as value i}}
                <dd class="allow" data-text="{{rq2}}日{{value.start_time}}-{{value.end_time}}送达" data-val="{{rq2}},{{value.start_time}}-{{value.end_time}}"> <label for="radio-choice-0">{{value.start_time}}-{{value.end_time}} </label> </dd>
              {{/each}}
          </dl>
      </div>
</script>


<div class="select-time-mask" onclick="hideDeliveryTime()" style="display: none;"></div>
<div class="select-time-wrap" id="select-model-01" style="display: none;"></div>

<nav class="mui-bar mui-bar-tab" style="    background-color: #3d3d3f;    position: relative; ">
    <span style="    color: #fff;font-size: .48rem;line-height: 1.273333rem;padding-left: .266667rem;">待支付 ¥29</span>
    <a href="javascript:" class="submitbutton" >确定下单</a>
</nav>
{/block}
{block name="script"}

  <script type="text/javascript">
    $(function(){

    //确定下单
    $('.submitbutton').on('click', function(){
      var way = $('[name="way"]:checked').val(), pay = $('[name="pay"]').val(), deliverytime =  $('[name="deliverytime"]').val()
      console.log(deliverytime);
      // $.post("{:url('index/index/getDeliveryTime')}", {
      //   "way":way,
      //   "pay":pay,
      //   "deliverytime":deliverytime
      // },function(da) {
      //
      // }, "json");


    })


    $('#payment').click(function(){
        $('.paylist').addClass('open');
        $('.paylist').next().addClass('open');
    })
    $('.mask').click(function(){
      $(this).removeClass('open')
      $('.paylist').removeClass('open')
    })
    $('.paylist-item').click(function(){
      var val = $(this).text(),payway = $(this).attr('data-payway')
      $('#paywaytext').text(val)
      $('.paylist').next().removeClass('open')
      $('.paylist').removeClass('open')
      $(this).addClass('active').siblings().removeClass('active')
      $.getJSON("{:url('index/cart/changecookie')}", {name: 'pay', 'val': payway}, function(json, textStatus) {});
    })

    })

    $('[name="way"]').on('click', function(){
      var val = $(this).val()
      $.getJSON("{:url('index/cart/changecookie')}", {name: 'way', 'val': val}, function(json, textStatus) {});
    })


    function showDeliveryTime() {
        var data = {}
            data.jt = new Date(),
            data.jm = data.jt.getMonth()+1,
            data.jd = data.jt.getDate();
            data.rq = data.jm+'-'+data.jd;
            data.mt = new Date();
            data.mt.setDate(data.mt.getDate()+1);//当前日期+几天
            data.mm = data.mt.getMonth()+1; // 月
            data.md = data.mt.getDate();    // 日
            data.rq2 = data.mm+'-'+data.md;
            data.ht = new Date();
            data.ht.setDate(data.ht.getDate()+2);//当前日期+几天
            data.hm = data.ht.getMonth()+1; // 月
            data.hd = data.ht.getDate();    // 日
            data.rq3 = data.hm+'-'+data.hd;
        $.post("{:url('index/index/getDeliveryTime')}", function(da) {
              data.list = da;
              var html = template('tpl2', data);
              $('.select-time-wrap').html(html);

              var times = new Date().getHours()+1;
              $('#jtdd').find('dd').each(function(){

                var start = $(this).attr('data-start')
                if(times>= parseInt(start)){
                  $(this).removeClass('allow').addClass('forbidden').removeAttr('onclick').click(function(){
                       mui.toast("亲，已经过了送货时间，请选择别的时间段~")
                  })
                }
              })
        }, "json");
        $(".select-time-mask").show(), $(".select-time-wrap").show();
    }
    $(document).on('click', '.select-time-box dd.allow',function(){
      var $this = $(this),text = $this.attr('data-text'),val = $this.attr('data-val')
        $('#pssj i').text(text)
        $('#pssj input').val(val)
        $(".select-time-wrap").hide(), $(".select-time-mask").hide()

        $.getJSON("{:url('index/cart/changecookie')}", {name: 'deliverytime', 'val': val}, function(json, textStatus) {
   		 });
    })
    function hideDeliveryTime() {
        $(".select-time-mask").hide(), $(".select-time-wrap").hide()
    }



  </script>
{/block}
